<template>
  <div class="index-container">
    <van-tabs :swipe-threshold="1" :active="active" swipeable>
      <van-tab title="全部">
        <all />
      </van-tab>
      <van-tab title="待支付">
        <unpaid />
      </van-tab>
      <van-tab title="已支付">
        <prepaid />
      </van-tab>
      <van-tab title="已失效">
        <failed />
      </van-tab>
    </van-tabs>
  </div>
</template>

<script>
import All from './all'
import Unpaid from './unpaid'
import Prepaid from './prepaid'
import Failed from './failed'
export default {
  name: 'Order',
  components: {
    All,
    Unpaid,
    Prepaid,
    Failed
  },
  data() {
    return {
      active: 0
    }
  },

  computed: {},
  created() {
    this.active = this.$route.query.id - 0
  },

  mounted() { },

  methods: {}
}
</script>
<style lang="scss" scoped>
.index-container {
  min-height: calc(100vh - 45px);
  background-color: #f5f7fa;
}
::v-deep .van-tabs__line {
  background-color: #11a8a4;
}
</style>
